var box5 = echarts.init(document.getElementById("box5"))
function resizeChart(){
  box5.resize()
}
window.addEventListener('resize',resizeChart)
var box5Option = {
  title: {
    text: '16%',
    left: 'center',
    top: '55',
    textStyle:{
      color:'#1890fe'
    },
    subtext: '前端开发工程师',
    subtextStyle: {
      color: '#909090',
    },
    // itemGap: -20,
  },
    visualMap: {
      show: false,
    },
    series: [
      {
        type: 'pie',
        //环形显示饼状图，实际上显示的是50-80之间的部分
        //上限不建议设置为100，echarts自带动画效果，设置为100动画效果很丑
        radius: ['50%', '80%'],
        center: ['50%', '50%'],
        data: [   
        //itemSyle是单项的背景颜色设置。
          { value: 84, itemStyle: { color: '#f1f1f1' } },
          { value: 16, itemStyle: { color: '#1890fe' } }
        ],
        label: {
          //将视觉引导图关闭
          show: false,
        },
        itemStyle:{
          borderWidth:7,
          borderColor:'#fff'
        },
        // 初始化echarts的动画效果
        animationType: 'scale',
        animationEasing: 'elasticOut',
        animationDelay: function (idx) {
          return Math.random() * 200;
        }
      }
    ]
}
box5.setOption(box5Option)